<template>
    <input 
    type="text"
    :value="modelValue"
    @input="(e) => $emit('update:modelValue', e.target.value)"
    />

</template>
<script setup lang="ts" name="MyInput">

defineProps(['modelValue']);
defineEmits(['update:modelValue']);

</script>

<style scoped>
    input {
        border: 2px solid blue;
        background-image: linear-gradient(125deg, red, yellow 50%, green);
        height: 30px;
        font-size: 20px;
        color: #000;
    }
</style>